import { patrolingCruise } from '@/api'
import { musicMessage } from '@/composables/useUpperControl'
import { useCarStore } from '@/stores/car'
import { ElMessage } from '@/stores/elMessage'
import { i18n } from '@/utils'
import { defineStore } from 'pinia'
import { ref } from 'vue'

export const useMusicStore = defineStore('music', () => {
  const isLoading = ref(false)
  const carStore = useCarStore()
  const musicNum = ref('')
  const selectName = ref('')
  async function changeMusic(val: string, status: boolean = true) {
    musicNum.value = val
    const data = {
      code: carStore.currentCar,
      param1: 4,
      param2: status ? 5 : 0,
      param3: status ? Number(val) : 255,
      param4: 255
    }
    await patrolingCruise(data)
    onClickStatus()
  }

  const musicVolumeValue = ref('')
  const musicIndex = ref('')
  const musicMode = ref('')
  const musicName = ref('')
  const musicStatus = ref('')
  async function onClickStatus() {
    const data = {
      code: carStore.currentCar,
      param1: 4,
      param2: 11,
      param3: 255,
      param4: 255
    }
    await patrolingCruise(data)
    if (musicMessage.value) {
      const { volumeValue, index, mode, name, status } = musicMessage.value
      musicVolumeValue.value = volumeValue
      musicIndex.value = index
      musicMode.value = mode
      musicName.value = name
      musicStatus.value = status
    }
  }

  // const musicListNumber: any = ref([])
  async function onClickMusicList() {
    const data = {
      code: carStore.currentCar,
      param1: 4,
      param2: 12,
      param3: 255,
      param4: 255
    }
    await patrolingCruise(data)
    // if (musicList.value.length > 0) {
    //   musicListNumber.value = musicList.value
    // }
  }

  const visibleChangeMusic = async (visible: boolean) => {
    if (visible) {
      onClickMusicList()
    }
  }

  // 修改音频文件名

  const renameValue = ref('')

  function selectMusicName(val: string) {
    selectName.value = val
  }

  async function handleReNameEvent() {
    if (renameValue.value !== '' && selectName.value !== '') {
      await onClickReName()
      onClickMusicList()
      onClickStatus()
    } else {
      ElMessage({
        type: 'warning',
        message: i18n.global.t('qing-xuan-ze-yin-le-bing-shu-ru-xiu-gai-de-wen-jian-ming')
      })
    }
  }

  async function onClickReName() {
    const data = {
      code: carStore.currentCar,
      param1: 4,
      param2: 14,
      param3: [selectName.value, renameValue.value].join(','),
      param4: 255
    }
    const res: any = await patrolingCruise(data)
    ElMessage({
      type: 'success',
      message: res.message
    })
    renameValue.value = ''
    selectName.value = ''
  }

  // 删除音乐
  const handleCommand = async (command: string) => {
    await deleteMusic(command)
    onClickMusicList()
    onClickStatus()
  }

  async function deleteMusic(command: string) {
    const data = {
      code: carStore.currentCar,
      param1: 4,
      param2: 13,
      param3: command,
      param4: 255
    }
    const res: any = await patrolingCruise(data)
    ElMessage({ type: 'success', message: res.message })
  }

  const currentBtnIndex = ref<number | null>(null)
  const changeBtnColor = (index: number) => {
    if (currentBtnIndex.value === index) {
      return {
        'background-color': '#ff931e',
        color: 'white'
      }
    }
  }
  // 音乐按钮操作
  async function onClickMusic(value: number, index: number) {
    currentBtnIndex.value = index
    const data = {
      code: carStore.currentCar,
      param1: 4,
      param2: value,
      param3: 255,
      param4: 255
    }
    await patrolingCruise(data)
    onClickStatus()
  }
  return {
    musicNum,
    changeMusic,
    musicVolumeValue,
    musicIndex,
    musicMode,
    musicName,
    musicStatus,
    onClickStatus,
    onClickMusicList,
    isLoading,
    selectName,
    renameValue,
    selectMusicName,
    handleReNameEvent,
    handleCommand,
    onClickMusic,
    changeBtnColor,
    visibleChangeMusic
  }
})
